<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src='swfobject.js'>
</script>
<script type="text/javascript" src='js/StaticData.js'>
</script>
<script type="text/javascript" src='js/Click2Call.js'>
</script>
<link rel="stylesheet" type="text/css" href="styles/trackbar.css" />
<script type="text/javascript" src="js/trackbar.js"></script>
<script type="text/javascript">

function positionStatus(e){	
	flashphoner = e.ref;
}

var params = {};
params.menu = "true";
params.swliveconnect = "true";
params.allowfullscreen = "true";
params.allowscriptaccess = "always";
params.wmode = "transparent";
var attributes = {};
var flashvars={}
flashvars.config="flashphoner.xml";
if (swfobject.hasFlashPlayerVersion("10.0.12")) {
	swfobject.embedSWF("jsphone.swf", "jsSWFDiv", "215", "138", "10.0.12", "expressInstall.swf", flashvars, params,attributes,positionStatus);
}

var paramsC2C = {};
paramsC2C.menu = "true";
paramsC2C.swliveconnect = "true";
paramsC2C.allowfullscreen = "true";
paramsC2C.allowscriptaccess = "always";
var attributesC2C = {};
var flashvarsC2C={}
flashvarsC2C.config="flashphoner.xml";
if (swfobject.hasFlashPlayerVersion("10.0.12")) {
	swfobject.embedSWF("Click2Call.swf", "click2CallSWFDiv", "220", "150", "10.0.12", "expressInstall.swf", flashvarsC2C, paramsC2C,attributesC2C);
}
</script>
<title>Click2Call</title>		
<style type="text/css">
  #jsSWFDiv, #click2CallSWFDiv, #phoneDiv, #infoDiv, #settingsDiv,
  #loginDiv {
            position: relative; 
            }
 
  #click2CallSWFDiv {
            top: 0px;
            left: 0px;
            }

  #jsSWFDiv {
            top: -10px;
            left: 230px;
            }   	

  #settingsDiv   {
            top: -190px;
            left: 235px;
            height: 100px; 
            width: 215px; 
            background: #fff; 
            padding: 22px 0 0 15px;
            font: 12px Arial; 
            visibility:hidden;
            background: url(mic_settings_background.png);
            }    	

  #phoneDiv {
            top: -120px;
            left: 280px;
            width: 147px;
            }
	  	
  #infoDiv  { 
            left: 250px;
            top: -140px;
            }

  #loginDiv {
            top: -160px;
            left: 5px;
            height: 65px; 
            width: 400px; 
            border: 1px solid #ddd; 
            padding: 10px; 
            font: 12px Arial; 
            float: left;
            background: #fff;
            -moz-opacity: 0.95;
            -khtml-opacity: 0.95;
            opacity: 0.95;
            }
	   	
  .settings_link {
            width: 42px;
            height: 14px; 
            font: 12px Arial;
            text-decoration: underline;
            -moz-user-select: none;
            -khtml-user-select: none;
            user-select: none;
            cursor: pointer; 
            float: left;
            border: none;
            background: #fff;
            padding: 0;
            color: #bb6666;
            text-align: left;
            }

  .call_button {
            width: 144px; 
            background-color: #009800;
            float: left;
            height: 30px;
            font: 20px Arial;
            color: #fff;
            text-align: center;
            line-height: 30px;
            border: 1px outset;
            -moz-user-select: none;
            -khtml-user-select: none;
            user-select: none;
            cursor: default; 
            margin-bottom: 3px;  
            }	
  
  .login_label {
            float: left; 
            width: 100px; 
            height: 22px; 
            line-height: 22px;                                
            }
                
  .login_input {
            float: left; 
            width: 100px;
            height: 22px; 
            }   	  	
   	
  #phoneDiv { z-index: 1; }
  #infoDiv { z-index: 2; }
  #click2CallSWFDiv { z-index: 3; }
  #jsSWFDiv { z-index: 4; }
  #loginDiv { z-index: 5; }
  #settingsDiv   {z-index: 6;}
</style>
		

<body>
<div id="click2CallSWFDiv">
	<a href="http://www.adobe.com/go/getflashplayer">
		<img border="0" src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
	</a>
</div>

<div id="jsSWFDiv">
	<a href="http://www.adobe.com/go/getflashplayer">
		<img border="0" src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
	</a>
</div>

<div id="phoneDiv">
	<input class="settings_link" id="settingsButton" type="submit" value="Mic Settings" onClick="openSettingsView();">
  	<input class="call_button" id="callButton" type="submit" value="Call" onClick="if (getElement('callButton').value == 'Call'){call();}else{hangup();}" style="background:#ddffdd;">
</div>

<div id="infoDiv" style="height: 30px; width: 126px; background: #ddd; border: 1px solid #bbb; padding: 5px; font: 12px Arial; visibility:hidden;">
  <div id="infoText" style="float: left; width: 120px; text-align: center; margin-bottom: 10px;"></div>
</div>

<div id="settingsDiv">
	<script type="text/javascript">
		trackbar.getObject('micVolume').init({
			onMove : function() {
				micVolume = this.leftValue;	
			},
			dual : false, // two intervals
			width : 150, // px
			leftValue : 100, // unit of value
			rightLimit : 100, // unit of value
			rightValue : 0 // unit of value
		});
	</script>
	<script type="text/javascript">
		trackbar.getObject('speakerVolume').init({
			onMove : function() {
				speakerVolume = this.leftValue;	
			},
			dual : false, // two intervals
			width : 150, // px
			leftValue : 100, // unit of value
			rightLimit : 100, // unit of value
			rightValue : 0 // unit of value
		});
	</script>
	
	<input class="button" type="submit" value="Save" onclick="saveMicSettings();" style="margin: 3px 0 0 75px; width: 50px;" onmousedown="this.style.border='1px inset';" onmouseup="this.style.border='1px outset';" onmouseout="this.style.border='1px outset';">
</div>

<div id="loginDiv">
     <div class="login_label">Username</div>
     <div class="login_input"><input type="text" id="username" value="VKP001" style="width: 100px;"></div>
     <div class="login_label">Password</div>
     <div class="login_input"><input type="text" id="password" value="VKP001" style="width: 100px;"></div>
     <div class="login_label">Server</div>
     <div class="login_input"><input type="text" id="server" value="sipnet.ru" style="width: 100px;"></div>
     <div class="login_label">Port</div>
     <div class="login_input"><input type="text" id="port" value="5060" style="width: 100px;"></div>
     <div class="login_label">Callee</div>
     <div class="login_input"><input type="text" id="callee" value="VKP009" style="width: 100px;"></div>     
</div>
</body>
</html>